<template>
  <div>
    user list
  </div>
</template>

<script lang="ts">
import { ref, defineComponent } from 'vue'
import { listUser } from 'api/user'
import { UserListItem } from 'types/user'
import storage from '@/utils/storage'

export default defineComponent({
  props: {
  },
  setup: () => {
    const query = {
      limit: 10,
      offset: 0,
    }
    let list = ref<UserListItem[]>([])
    listUser(query).then((res: any) => {
      list = res.items.map((x: any) => {
        return {
          id: x.id,
          username: x.username,
        }
      })
    }).catch((err: any) => {
      console.log('err', err)
    })
    // const a = import.meta.env
    storage.setUserInfo({
      id: 11,
      username: 'raul',
    })
    // console.log('enva', a)
    const count = ref(0)
    return { count, list }
  },
})
</script>

<style lang="scss">
a {
  color: $primary-color !important;
}

label {
  margin: 0 0.5em;
  font-weight: bold;
}

code {
  background-color: #eee;
  padding: 2px 4px;
  border-radius: 4px;
  color: #304455;
}
</style>
